<!doctype html>
<html lang="zh-CN">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>记账 - 登录</title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="/css/styles.css">
</head>
<body>
  <main class="container py-5">
    <div class="row justify-content-center">
      <div class="col-md-6">
        <div class="card shadow-sm">
          <div class="card-body">
            <h1 class="card-title mb-4">记账系统</h1>
            <section id="login">
              <div class="mb-3">
                <label class="form-label">用户名</label>
                <input id="username" class="form-control" />
              </div>
              <div class="mb-3">
                <label class="form-label">密码</label>
                <input id="password" type="password" class="form-control" />
              </div>
              <div class="d-grid">
                <button id="btnLogin" class="btn btn-primary">登录</button>
              </div>
              <p id="loginMsg" class="text-danger mt-2"></p>
              <!-- 开发提示：仅用于本地开发，生产环境请移除 -->
              <div class="alert alert-warning mt-3" role="alert">
                开发账号：<strong>admin</strong> 密码：<strong>secret123</strong>（仅开发环境展示）
              </div>
            </section>
          </div>
        </div>
      </div>
    </div>
  </main>

  <script src="/js/app.js"></script>
</body>
</html>